<template>
	<view class="container">
		<u--form ref="form" :model="form" labelWidth="100px" :rules="rules">
			<u-form-item label="姓名" prop="nickName" borderBottom required>
				<u-input v-model="form.nickName" placeholder="请输入姓名" border="none" inputAlign='right' />
			</u-form-item>
		</u--form>
		<view class="action-box flex align-center">
			<u-button type="primary" @click="submit">提交</u-button>
		</view>
	</view>
</template>

<script>
import { updateUserProfile } from "@/api/mine/user"
import { mapMutations } from "vuex"
import { mapGetters } from "vuex"
import config from '@/config'
import { map as _map } from 'lodash'

export default {
	data() {
		return {
			baseUrl: config.baseUrl,
			form: {
				nickName: '',
			},
			rules: {
				nickName: [
					{
						type: 'string',
						required: true,
						message: '请填写姓名',
						trigger: ['blur']
					}
				]
			},
		}
	},
	computed: {
		...mapGetters(['consignor']),
	},
	onLoad(option) {
		this.userId = this.consignor.sysUser.userId;
		this.form.nickName = this.consignor.sysUser.nickName;
	},
	methods: {
		...mapMutations(['SET_CONSIGNOR']),
		updateGroup(data) {
			console.log(data)
			this.submitLicense = data;
		},
		updateIdCard(data) {
			console.log(data)
			this.submitIdCards = data;
		},
		submit(ref) {
			this.$nextTick(() => {
				this.$refs.form.validate().then(async (res) => {
					let params = {
						...this.form,
						userId: this.userId
					}
					updateUserProfile(params).then(response => {
						this.consignor.sysUser.nickName = this.form.nickName;
						this.SET_CONSIGNOR(this.user)
						this.$modal.msgSuccess("修改成功")
						setTimeout(() => {
							this.$store.dispatch('GetInfo').then(res => {
								this.$tab.navigateBack()
							})
						}, 1000)
					})
				})
			})

		}

	}
}
</script>

<style lang="scss" scoped>
page {
	background-color: #ffffff;
	padding: 10px 15px;
}

.form-box {
	padding: 0 15px 15px;
	background-color: #fff;
}

.segmented-control {
	margin-bottom: 15px;
}

.button-group {
	margin-top: 15px;
	display: flex;
	justify-content: space-around;
}

.form-item {
	display: flex;
	align-items: center;
	flex: 1;
}

.button {
	display: flex;
	align-items: center;
	height: 35px;
	line-height: 35px;
	margin-left: 10px;
}

.action-box {
	background-color: #ffffff;
	padding: 24rpx;
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	width: 100%;
	display: flex;
	align-items: center;

	.action-item {
		width: 50%;
	}
}

.u-upload__wrap {
	justify-content: flex-end;
}
</style>
